import { reactive, ref, onMounted, nextTick } from 'vue'
import { recordGetRecordApi, getImageUrlApi, recordSaveApi, recordRemoveApi } from '@/api/ReviewBusiness/01Project/project'
import { EditType } from '@/type/BaseEnum'
import { getArrayToHis, getArrayToHis1 } from '@/utils/index'
import { quoteStore } from '@/store/quoteData'
export default function approvalModel(RefShowPdf?) {
  const RefApproval = ref<{ show: (type: string, row?: any) => void }>()
  const store = quoteStore()
  const showDate = reactive({
    // 数据怎么处理 1 查询数据 2 canvas数据 3 mark数据 4 analysis 
    fileDate: {},
    search: {
      filesId: '',
      pageNumber: 1
    },
    limits: true,
    // img数据
    recordList: [],
    imageId: '',
    img_info: [] as any,
    numPages: 0,
    type: 'R'
  })
  const showBtn = (row?: any) => {
    RefApproval?.value?.show(EditType.ADD, row)
  }
  // 查询图片数据
  const getImage = async (row) => {
    console.log(row, 'fileDate');
    const res: any = await recordGetRecordApi(row)
    if (res.code == 200 && res.data.length > 0) {
      //数据
      showDate.recordList = res.data
      console.log(res.recordList, '有数据');
      showDate.numPages = res.data[0].count
      const imagePath = res.data[0].imagePath
      showDate.imageId = res.data[0].imageId
      const path = imagePath.substring(8, imagePath.length)
      const file = await getImageUrl(path) as any
      const image = window.webkitURL.createObjectURL(new Blob([file], { type: 'image/png' }))
      // 第一次怎么给你数据初始化
      let arr = []
      if (row.pageNumber === 1) {
        const historyData = store.queryData(row.pageNumber) as any
        if (historyData.length > 0) {
          arr = getArrayToHis1(historyData[0].distance)
        }
      }
      const item = {
        imageBase64: `${image}`,
        page: showDate.search.pageNumber,
        fileId: showDate.search.filesId,
        commentsDTOs: arr.length > 0 ? arr : [], // 为什么是一个空的 数据回显操作
        records: res.data
      }
      // 这个地方有问题 
      // 怎么解决不需要那个
      showDate.img_info.push({ ...item })
    } else {
      // 没有数据 全部清空啊数据
      showDate.recordList = []
      showDate.numPages = 0
      showDate.imageId = ''
      showDate.img_info = []
    }
  }
  // 查询图片数据
  const getImageLook = async (row) => {
    console.log(row, 'fileDate');
    const res: any = await recordGetRecordApi(row)
    if (res.code == 200 && res.data.length > 0) {
      //数据
      showDate.recordList = res.data
      console.log(res.recordList, '有数据');
      showDate.numPages = res.data[0].count
      const imagePath = res.data[0].imagePath
      showDate.imageId = res.data[0].imageId
      const path = imagePath.substring(8, imagePath.length)
      const file = await getImageUrl(path) as any
      const image = window.webkitURL.createObjectURL(new Blob([file], { type: 'image/png' }))
      const arr = getArrayToHis1(res.data)
      const item = {
        imageBase64: `${image}`,
        page: showDate.search.pageNumber,
        fileId: showDate.search.filesId,
        commentsDTOs: arr, // 这个是用来干嘛的
        records: res.data
      }
      // 这个地方有问题 
      // 怎么解决不需要那个
      showDate.img_info.push({ ...item })
    } else {
      console.log('没有数据');

      // 没有数据 全部清空啊数据
      showDate.recordList = []
      showDate.numPages = 0
      showDate.imageId = ''
      showDate.img_info = []
    }
    return res
  }
  // 分页处理 上一页
  const btnPre = async () => {
    // 1 清空了数据  2 如果不清空数据 怎么处理  3 小数据怎么处理 怎么继续调价 怎么减少 4 react 怎么渲染呢
    showDate.img_info = []
    showDate.recordList = []
    RefShowPdf.value?.clearCanvasDate()
    // 判断页码 上一页 
    await getImage({ filesId: showDate.search.filesId, pageNumber: showDate.search.pageNumber - 1 })
    let page = showDate.search.pageNumber
    page = page > 1 ? page - 1 : showDate.numPages
    console.log(page, 'page');
    const historyData = store.queryData(page) as any
    showDate.search.pageNumber = page
    if (historyData.length > 0) {
      const arr = getArrayToHis1(historyData[0].distance)
      showDate.recordList = arr
      showDate.img_info[0].commentsDTOs = arr
    }
    showDate.imageId = showDate.img_info[0].records[0].imageId
    if (showDate.img_info.length > 0) {
      nextTick(() => {
        //  console.log(RefImgCanVas.value,'RefImgCanVas');
        RefShowPdf.value?.initImage()
      })
    }
  }
  // 下一页 1 
  const btnNext = async () => {
    // 清空了数据 是否正确 
    showDate.img_info = []
    showDate.recordList = []
    RefShowPdf.value?.clearCanvasDate()

    await getImage({ filesId: showDate.search.filesId, pageNumber: showDate.search.pageNumber + 1 })
    let page = showDate.search.pageNumber
    page = page < showDate.numPages ? page + 1 : 1
    console.log(page, 'page');
    const historyData = store.queryData(page) as any
    showDate.search.pageNumber = page
    if (historyData.length > 0) {
      const arr = getArrayToHis1(historyData[0].distance)
      showDate.recordList = arr
      showDate.img_info[0].commentsDTOs = arr
    }
    showDate.imageId = showDate.img_info[0].records[0].imageId
    if (showDate.img_info.length > 0) {
      nextTick(() => {
        //  console.log(RefImgCanVas.value,'RefImgCanVas');
        RefShowPdf.value?.initImage()
      })
    }
  }
  const getFileList = async (row?) => {
    showDate.fileDate = row
    showDate.search.filesId = row.id
    showDate.search.pageNumber = 1
  }
  const getImageUrl = async (path) => {
    return new Promise((resolve, reject) => {
      getImageUrlApi(path).then((res) => {
        resolve(res)
      }).catch((err) => {
        console.log(err);
        reject(err)
      })
    })
  }
  const changeName = (title) => {
    const arr = JSON.parse(JSON.stringify(showDate.recordList))
    const newArr = getArrayToHis(arr)
    if (title) {
      showDate.img_info[0].commentsDTOs = []
      const copy = newArr.flat().filter((item: any) => {
        return item.title === title
      })
      showDate.img_info[0].commentsDTOs = [copy]
    } else {
      showDate.img_info[0].commentsDTOs = newArr
    }
  }
  const clearShowDate = () => {
    showDate.fileDate = {}
    showDate.search = {
      filesId: '',
      pageNumber: 1
    }
    showDate.limits = true
    showDate.imageId = ''
    showDate.img_info = [] as any
    showDate.numPages = 0
    showDate.type = 'R'
    showDate.numPages = 0
  }
  // 筛选数据
  return {
    RefApproval, showBtn, showDate, getImage, getImageLook, btnPre, btnNext, getFileList, changeName, clearShowDate
  }
}